<!doctype html public "-//W3C//DTD HTML 4.0 Frameset//EN""http://www.w3.org/TR/REC-html40/frameset.dtd">
<html>
<head>
<title>
 Overview
</title>
<link rel ="stylesheet" type="text/css" href="stylesheet.css" title="Style">
<script>
function asd() {
	
		parent.document.title="editorObjectManager.js Overview";
	
}
</script>
</head>
<body bgcolor="white" onload="asd();">

<!-- ========== START OF NAVBAR ========== -->
<a name="navbar_top"><!-- --></a>
<table border="0" width="100%" cellpadding="1" cellspacing="0">
<tr>
<td colspan=2 bgcolor="#EEEEFF" class="NavBarCell1">
<a name="navbar_top_firstrow"><!-- --></a>
<table border="0" cellpadding="0" cellspacing="3">
  <tr align="center" valign="top">
  
  
  <td bgcolor="#EEEEFF" class="NavBarCell1">    <a href="overview-summary.html"><font class="NavBarFont1"><b>Overview</b></font></a>&nbsp;</td>
  <td bgcolor="#FFFFFF" class="NavBarCell1Rev">	&nbsp;<font class="NavBarFont1Rev"><b>File</b></font>&nbsp;</td>
  

  <td bgcolor="#FFFFFF" class="NavBarCell1"> 	<font class="NavBarFont1">Class</font>&nbsp;</td>
  <td bgcolor="#EEEEFF" class="NavBarCell1">    <a href="overview-tree.html"><font class="NavBarFont1"><b>Tree</b></font></a>&nbsp;</td>
  <td bgcolor="#EEEEFF" class="NavBarCell1">    <a href="index-all.html"--><font class="NavBarFont1"><b>Index</b></font></a>&nbsp;</td>
  <td bgcolor="#EEEEFF" class="NavBarCell1">    <a href="help-doc.html"><font class="NavBarFont1"><b>Help</b></font></a>&nbsp;</td>
  </tr>
</table>
</td>
<td bgcolor="#EEEEFF" align="right" valign="top">
<em>
<b></b></em>
</td>
</tr>

<tr>
<td bgcolor="white" class="NavBarCell2"><font size="-2">
&nbsp;PREV&nbsp;
&nbsp;NEXT</font></td>
<td bgcolor="white" class="NavBarCell2"><font size="-2">
  <a href="index.html" target="_top"><b>FRAMES</b></a>  &nbsp;
&nbsp;<a href="overview-summary.html" target="_top"><b>NO FRAMES</b></a>
&nbsp;&nbsp;
<script>
  <!--
  if(window==top) {
    document.writeln('<A HREF="allclasses-noframe.html" TARGET=""><B>All Classes</B></A>');
  }
  //-->
</script>
<noscript>
<a href="allclasses-noframe.html" target=""><b>All Classes</b></a>
</noscript>
</font></td>
</tr>
</table>
<!-- =========== END OF NAVBAR =========== -->

<hr>
<center>
	
	   <h2>editorObjectManager.js</h2>
	
</center>

	


<h4>Summary</h4>
<p>
	
		No overview generated for 'editorObjectManager.js'<BR/><BR/>
	
</p>

<hr>


    <table border="1" cellpadding="3" cellspacing="0" width="100%">
    <tr bgcolor="#CCCCFF" class="TableHeadingColor">
    <td colspan=2><font size="+2">
    
        <b>Class Summary</b>
    
    </font></td>
    </tr>
    
    <tr bgcolor="white" class="TableRowColor">
    <td width="15%"><b><a href="editorObjectManager.html">editorObjectManager</a></b></td>
    <td>&nbsp;</td>
    </tr>
    
    </table>
    <hr/> 


<!-- ========== METHOD SUMMARY =========== -->

<!-- ========== END METHOD SUMMARY =========== -->


        <pre class="sourceview"><span class="comment">/**
 * Responsible by the management of the editor objects in an edition area.
 * <span class="attrib">@author</span> Roosevelt de Lima Sardinha
 * <span class="attrib">@param</span> {Object} editionArea The edition area object that this EOM manages the EOs.
 * <span class="attrib">@constructor</span>
 */</span>
<span class="reserved">function</span> editorObjectManager(editionArea){
    var thisObject = <span class="reserved">this</span>;
    var objectIdArray = new Array;
    var objectArray = new Array;

	<span class="comment">/**
	 * The edition area object that this EOM manages the EOs
	 * <span class="attrib">@type</span> {Object}
	 */</span>
	<span class="reserved">this</span>.editionArea = editionArea;
    
    <span class="comment">// Counters</span>
    var counter = 0;
    var memo = new Array;
    
	var myKeyboard = <span class="reserved">this</span>.editionArea.workspace.keyboard;
	 
	<span class="comment">/**
	 * Enables the use of the keyboard in the edition area.
	 */</span> 
    <span class="reserved">this</span>.enableKeyboard = <span class="reserved">function</span>(){
        myKeyboard.enabled = true;
    }
    
	<span class="comment">/**
	 * Disables the use of the keyboard in the edition area.
	 */</span>
    <span class="reserved">this</span>.disableKeyboard = <span class="reserved">function</span>(){
        myKeyboard.enabled = false;
    }
    
	<span class="comment">/**
	 * Returns the counter. This counter is used to attrib to an EO its id. Preventing th ids from being equal in any case.
	 * <span class="attrib">@return</span> The actual value of the counter.
	 * <span class="attrib">@type</span> {Int}
	 */</span>
    <span class="reserved">this</span>.getCounter = <span class="reserved">function</span>(){
        counter++;
        <span class="reserved">return</span> counter;
    }
    
	<span class="comment">/**
	 * Sets a value to the counter This counter is used to attrib to an EO its id. Preventing the ids from being equal in any case.
	 * <span class="attrib">@param</span> {Int} value The value to set to the counter
	 */</span>
	<span class="reserved">this</span>.setCounter = <span class="reserved">function</span>(value){
		counter = value;
	}
	
	<span class="comment">/**
	 * Creates an EO given the type of EO to be created. After you can append it to the edition area using another method.
	 * <span class="attrib">@param</span> {String} type The type of EO to be created. The same name of the folder of the tool.
	 * <span class="attrib">@return</span> The EO created
	 * <span class="attrib">@type</span> {Object}
	 */</span>
    <span class="reserved">this</span>.createEO = <span class="reserved">function</span>(type){
        <span class="comment">// Creates an Editor Object of any type</span>
        <span class="reserved">if</span> (type == null) {
            type = <span class="literal">'Error: EOM -&gt; CreateEO : type cannot be null.'</span>;
        }
        var id = <span class="reserved">this</span>.editionArea.id + <span class="literal">'-'</span> + type + <span class="literal">'_'</span> + thisObject.getCounter();

		var inheritEO = new EO(id,{
			EOM: <span class="reserved">this</span>
		});
		
		<span class="comment">// Set default propertyBox </span>
		<span class="reserved">if</span> (editionArea.workspace.getPropertyBoxByIndex(0)){
			inheritEO.setPropertyBox(editionArea.workspace.getPropertyBoxByIndex(0).id);
		}

		<span class="comment">// Set default instructionBox</span>
		<span class="reserved">if</span> (editionArea.workspace.getInstructionBoxByIndex(0)){
			inheritEO.setInstructionBox(editionArea.workspace.getInstructionBoxByIndex(0).id);
		}		

		var myEO = new window[type]();
		<span class="reserved">for</span> (var key in inheritEO){
			<span class="reserved">if</span> (myEO.hasOwnProperty(key) == false) {
				myEO[key] = inheritEO[key];
			}<span class="reserved">else</span> {
				myEO[<span class="literal">'user_'</span> + key] = myEO[key];
				myEO[key] = inheritEO[key];
			}
		}
		myEO.type = type;
		myEO.init();

        <span class="reserved">return</span> myEO;
    }
    
	<span class="comment">/**
	 * Returns an EO given its id.
	 * <span class="attrib">@param</span> {String} id The unique id of the EO.
	 * <span class="attrib">@return</span> The EO that has the id. Or -1 if it wasn't found. 
	 * <span class="attrib">@type</span> {Object}
	 */</span>
    <span class="reserved">this</span>.getEOById = <span class="reserved">function</span>(id){
        <span class="comment">// Returns an editor object that has the Id</span>
        var index = -1;
        <span class="reserved">for</span> (var i = 0; i &lt; objectIdArray.length; i++) {
            <span class="reserved">if</span> (objectIdArray[i] == id) {
                index = i;
                break;
            }
        }        
        <span class="reserved">if</span> (index != -1) {
            <span class="reserved">return</span> objectArray[index];
        }
        <span class="reserved">else</span> {
            <span class="reserved">return</span> index;
        }
    }
    
	<span class="comment">/**
	 * The EO that has this HTML Object in its objectList.
	 * <span class="attrib">@param</span> {String} HTMLObjectId The id of the DOM node we are searching for.
	 * <span class="attrib">@return</span> The EO that has the HTML Object. Or -1 if it wasn't found.
	 * <span class="attrib">@type</span> {Object}
	 */</span>
    <span class="reserved">this</span>.getEOByHTMLObjectId = <span class="reserved">function</span>(HTMLObjectId){
        <span class="comment">// Returns an Editor Object that has the HTML Object with the Id</span>
        var index = -1;
        var EO = null;
        var myId;
        <span class="reserved">for</span> (var i = 0; i &lt; objectArray.length; i++) {
            EO = objectArray[i];
            <span class="reserved">for</span> (var j = 0; j &lt; EO.objectList.length; j++) {
                myId = EO.getHTMLObject(EO.objectList[j]).id;
                <span class="reserved">if</span> (myId == HTMLObjectId) {
                    index = i;
                    break;
                }
            }
        }
        
        <span class="reserved">if</span> (index != -1) {
            <span class="reserved">return</span> objectArray[index];
        }
        <span class="reserved">else</span> {
            <span class="reserved">return</span> index;
        }
    }
    
	<span class="comment">/**
	 * Unselects all EOs.
	 */</span>
    <span class="reserved">this</span>.unselectAll = <span class="reserved">function</span>(){
        <span class="reserved">for</span> (var i = 0; i &lt; objectArray.length; i++) {
            <span class="reserved">this</span>.unselectEO(objectArray[i].id);
        }
    }
    
	<span class="comment">/**
	 * Returns the right coordinate of the object that has the maximum right coordinate.
	 * <span class="attrib">@return</span> The right coordinate.
	 * <span class="attrib">@type</span> {Int}
	 */</span>
    <span class="reserved">this</span>.getMaxRight = <span class="reserved">function</span>(){
        <span class="reserved">if</span> (objectArray.length == 0) {
            <span class="reserved">return</span> 0;
        }
        var divEO = document.getElementById(objectArray[0].id);
        var maxRight = divEO.offsetLeft + divEO.offsetWidth;
        var right = 0;
        <span class="reserved">for</span> (var i = 1; i &lt; objectArray.length; i++) {
            divEO = document.getElementById(objectArray[i].id);
            right = divEO.offsetLeft + divEO.offsetWidth;
            <span class="reserved">if</span> (right &gt; maxRight) {
                maxRight = right;
            }
        }
        <span class="reserved">return</span> maxRight;
    }
    
	<span class="comment">/**
	 * Returns the bottom coordinate of the object that has the maximum bottom coordinate.
	 * <span class="attrib">@return</span> The bottom coordinate.
	 * <span class="attrib">@type</span> {Int}
	 */</span>
    <span class="reserved">this</span>.getMaxBottom = <span class="reserved">function</span>(){
        <span class="reserved">if</span> (objectArray.length == 0) {
            <span class="reserved">return</span> 0;
        }
        
        var divEO = document.getElementById(objectArray[0].id);
        var maxBottom = divEO.offsetTop + divEO.offsetHeight;
        var bottom = 0;
        <span class="reserved">for</span> (var i = 1; i &lt; objectArray.length; i++) {
            var divEO = document.getElementById(objectArray[i].id);
            bottom = divEO.offsetTop + divEO.offsetHeight;
            <span class="reserved">if</span> (bottom &gt; maxBottom) {
                maxBottom = bottom;
            }
        }
        <span class="reserved">return</span> maxBottom;
    }
	
    <span class="comment">/**
     * Removes an EO.
     * <span class="attrib">@param</span> {String} id The id of the EO to be removed.
     */</span>
    <span class="reserved">this</span>.removeEO = <span class="reserved">function</span>(id){
        <span class="comment">// Removes an EO</span>
        var index = -1;
        <span class="reserved">for</span> (var i = 0; i &lt; objectIdArray.length; i++) {
            <span class="reserved">if</span> (objectIdArray[i] == id) {
                index = i;
                break;
            }
        }
        
        <span class="reserved">if</span> (index != -1) {
            var EO = objectArray[index];
			<span class="reserved">if</span> (EO.propertyBox) {
				EO.propertyBox.removeAllTabs();
			}
            <span class="comment">//Removes the object from the document.</span>
            <span class="reserved">for</span> (var j = 0; j &lt; EO.objectList.length; j++) {
                var HTMLObject = EO.getHTMLObject(objectArray[index].objectList[j]);
                HTMLObject.parentNode.removeChild(HTMLObject);
                delete HTMLObject;
            }
            
            <span class="comment">// Remove the div that contains the EO</span>
            document.getElementById(EO.id).parentNode.removeChild(document.getElementById(EO.id));
            
            <span class="comment">// Remove the object from the control arrays</span>
            objectArray.splice(index, 1);
            objectIdArray.splice(index, 1);

			<span class="reserved">if</span> (EO.onRemove) {
				EO.onRemove();
			}
			
            <span class="comment">// Remove the EO</span>
            delete EO;
        }
    }
    
	<span class="comment">/**
	 * Removes only the selected EOs.
	 * <span class="attrib">@return</span> The number of EOs removed.
	 * <span class="attrib">@type</span> {Int}
	 */</span>
    <span class="reserved">this</span>.removeSelectedEOs = <span class="reserved">function</span>(){
        var counter = 0;
        <span class="comment">// Remove the selected EOs in the edition area.</span>
        <span class="reserved">for</span> (var i = 0; i &lt; objectArray.length; i++) {
            <span class="reserved">if</span> (objectArray[i].selected) {
                thisObject.removeEO(objectIdArray[i]);
                i--;
                counter++;
            }
        }
        
        <span class="reserved">return</span> counter;
    }
	
	<span class="comment">/**
	 * Removes all EOs.
	 */</span>
	<span class="reserved">this</span>.removeAllEOs = <span class="reserved">function</span>(){
		<span class="comment">// Remove every EO in the edition area.</span>
		<span class="reserved">for</span>(var i=0; i&lt;objectArray.length; i++){
			thisObject.removeEO(objectIdArray[i]);
			i--;	
		}
	}	

	Array.<span class="reserved">prototype</span>.find = <span class="reserved">function</span>(content){
		var index = -1; 
		<span class="reserved">for</span>(var i = 0; i &lt; <span class="reserved">this</span>.length; i++){
			<span class="reserved">if</span> (<span class="reserved">this</span>[i] == content){
				index = i;
			}
		}
		<span class="reserved">return</span> index;
	}
	
	Array.<span class="reserved">prototype</span>.apply = <span class="reserved">function</span>(array){
		<span class="reserved">for</span>(var i = 0; i &lt; array.length; i++){
			<span class="reserved">if</span> (<span class="reserved">this</span>.find(array[i]) == -1){
				<span class="reserved">this</span>.push(array[i]);
			}
		}
		<span class="reserved">return</span> <span class="reserved">this</span>;
	}
	
	<span class="reserved">function</span> cloneNode(node){
	    var clonedNode = node.nodeType == 3 ? document.createTextNode(node.nodeValue) : node.cloneNode(false);
 	   	<span class="comment">// Recurse</span>
    	var child = node.firstChild;
    	<span class="reserved">while</span>(child) {
        	clonedNode.appendChild(cloneNode(child));
        	child = child.nextSibling;
		}
		<span class="reserved">return</span> clonedNode;
	}
	
	<span class="comment">/**
	 * Copies an EO. It still doesn't function well in Internet Explorer.
	 * <span class="attrib">@param</span> {String} id The id of the EO to be copied.
	 * <span class="attrib">@return</span> A copy of the EO.
	 * <span class="attrib">@type</span> {Object}
	 */</span>
    <span class="reserved">this</span>.copyEO = <span class="reserved">function</span>(id){
        <span class="comment">// Copies an editor object to the "memory" of the application, for being pasted in another moment.</span>
        var objCopy;
        var obj = thisObject.getEOById(id);
        
        <span class="comment">// Copies the object.</span>
        objCopy = thisObject.createEO(obj.type);

		<span class="comment">// Copy Most Properties</span>
		<span class="reserved">for</span> (var key in obj){
			<span class="reserved">if</span> (obj.objectList.find(key) == -1) {
				objCopy[key] = obj[key];
			}
		}
		var counter = <span class="reserved">this</span>.getCounter();
		objCopy.id = <span class="reserved">this</span>.editionArea.id + <span class="literal">"-"</span> + obj.type + <span class="literal">"_"</span> + counter;
		objCopy.selected = false;
		
		<span class="comment">// Copy DOM nodes.</span>
		<span class="reserved">for</span>(var k=0; k &lt; obj.objectList.length; k++){
			var key = obj.objectList[k] ;
			var HTMLObject = obj[key];
			var HTMLCopyObject = cloneNode(HTMLObject);
			
			objCopy[key] = HTMLCopyObject;	
		}

		var list = <span class="reserved">this</span>.attribIds(objCopy);
		var idsList = new Array();	
		var key = <span class="literal">""</span>;
		<span class="reserved">for</span> (var i = 0; i &lt; list.length; i++){
			key = list[i][0];	
			objCopy[key] = null;
			objCopy[key] = list[i][2];
			idsList.push = list[i][1];
		}
		
		objCopy.selectorIds = idsList;
				
        memo.push(objCopy);
		
		<span class="reserved">return</span> objCopy;
    }
    
	<span class="comment">/**
	 * Copies all selected editor objects to the "memory" of the application, for being pasted in an another moment.
	 */</span>
    <span class="reserved">this</span>.copySelectedEOs = <span class="reserved">function</span>(){
        <span class="reserved">for</span> (var i = 0; i &lt; objectArray.length; i++) {
            <span class="reserved">if</span> (objectArray[i].selected == true) {
                thisObject.copyEO(objectIdArray[i]);
            }
        }
    }
	
    <span class="comment">/**
     * Cleans the memo array.
     */</span>
    <span class="reserved">this</span>.cleanMemo = <span class="reserved">function</span>(){
        
        <span class="reserved">for</span> (var i = 0; i &lt; memo.length; i++) {
            memo.pop();
            i--;
        }
    }
    
    var memoCopy = new Array;
	
	<span class="comment">/**
	 * Returns a copy of the memo array.
	 * <span class="attrib">@return</span> A copy of the memo array. It has all the EOs in the memo.
	 * <span class="attrib">@type</span> {Array}
	 */</span>
    <span class="reserved">this</span>.retrieveMemo = <span class="reserved">function</span>(){
        memoCopy = memo.slice();
        <span class="reserved">return</span> memoCopy;
    }
    
	<span class="comment">/**
	 * Unregisters an EO from this EOM.The EO won't be managed from this EOM anymore.
	 * <span class="attrib">@param</span> {Object} EO The EO to be unregistered.  
	 */</span>
	<span class="reserved">this</span>.unregisterEO = <span class="reserved">function</span>(EO){
		var index = objectIdArray.find(EO.id);
		objectIdArray.splice(index,1);
		objectArray.splice(index,1);
	}
	
	<span class="comment">/**
	 * Registers an EO to be managed by the EOM.
	 * <span class="attrib">@param</span> {Object} EO The EO to be registered.
	 */</span>
    <span class="reserved">this</span>.registerEO = <span class="reserved">function</span>(EO){
        objectIdArray.push(EO.id);
        objectArray.push(EO);
    }
    
	<span class="comment">/**
	 * Disables dragging an EO.
	 * <span class="attrib">@param</span> {String} id The id of the EO that dragging will be disabled.  
	 */</span>
    <span class="reserved">this</span>.stopDraggingEO = <span class="reserved">function</span>(id){
        $(<span class="literal">'#'</span> + id).draggable(<span class="literal">'disable'</span>);
    }
    
	<span class="comment">/**
	 * Enables dragging an EO.
	 * <span class="attrib">@param</span> {String} id The id of the EO that dragging will be enabled.  
	 */</span>	
    <span class="reserved">this</span>.startDraggingEO = <span class="reserved">function</span>(id){
        $(<span class="literal">'#'</span> + id).draggable(<span class="literal">'enable'</span>);
    }
    
	<span class="comment">/**
	 * Enables EO resize of one previously disabled.
	 * <span class="attrib">@param</span> {String} id The id of the EO to be resized.
	 * <span class="attrib">@param</span> {Int} width The minimum width of the resizement.
	 * <span class="attrib">@param</span> {Int} height The minimum height of the resizement.
	 */</span>
    <span class="reserved">this</span>.enableEOResize = <span class="reserved">function</span>(id, width, height){
        $(<span class="literal">'#'</span> + id).resizable(<span class="literal">'enable'</span>);
        $(<span class="literal">'#'</span> + id).resizable(<span class="literal">'option'</span>, <span class="literal">'minWidth'</span>, width);
        $(<span class="literal">'#'</span> + id).resizable(<span class="literal">'option'</span>, <span class="literal">'minHeight'</span>, height);
    }
	
	<span class="comment">/**
	 * Corrects the position of an object in the edition Area, so it's not going to get outside.
	 * <span class="attrib">@param</span> {String} id The id of the EO to correct the position
	 */</span>
    <span class="reserved">this</span>.correctPosition = <span class="reserved">function</span>(id){
        		
        var divEO = document.getElementById(id);
        
        <span class="comment">// If its larger than the editionArea, resizes the editionArea.</span>
        var divEOWidth = divEO.offsetWidth;
        <span class="reserved">if</span> (editionArea.width &lt; divEOWidth) {
            editionArea.setWidth(divEOWidth);
        }
        
        var divEOHeight = divEO.offsetHeight;
        <span class="reserved">if</span> (editionArea.height &lt; divEOHeight) {
            editionArea.setHeight(divEOHeight);
        }
        
        <span class="comment">//Calculates the difference in the X axis for correction. How much is it outside the editionArea?</span>
        var editionAreaWidth = editionArea.width;
        var divEORight = divEO.offsetLeft + divEO.offsetWidth;
        var diffX = editionAreaWidth - divEORight;
        
        <span class="comment">//Calculates the difference in the Y axis for correction. How much is it outside the editionArea?</span>
        var editionAreaHeight = editionArea.height;
        var divEOBottom = divEO.offsetTop + divEO.offsetHeight;
        var diffY = editionAreaHeight - divEOBottom;
        
        <span class="comment">// If an object is outside the area, corrects its position.</span>
        <span class="reserved">if</span> (diffX &lt; 0) {
            divEO.style.left = divEO.offsetLeft + diffX + <span class="literal">'px'</span>;
        }
        
        <span class="reserved">if</span> (diffY &lt; 0) {
            divEO.style.top = divEO.offsetTop + diffY + <span class="literal">'px'</span>;
        }
    }
    
	<span class="comment">/**
	 * Selects an EO.
	 * <span class="attrib">@param</span> {String} id The unique id of the EO to be selected.
	 */</span>
    <span class="reserved">this</span>.selectEO = <span class="reserved">function</span>(id){
               
		myKeyboard.EOM = <span class="reserved">this</span>;
		
        var EO = <span class="reserved">this</span>.getEOById(id);
        
		<span class="reserved">if</span> (EO.propertyBox) {
			EO.showProperties();
			EO.onShowProperties(EO);
		}
		
		<span class="reserved">if</span> (EO.instructionBox) {
			EO.instructionBox.setInstruction(EO.help, false);
			EO.onShowInstructions(EO);
		}
		
		<span class="reserved">if</span> (EO.onSelect) {
			EO.onSelect(EO);
		}
		
        EO.selected = true;
        <span class="reserved">if</span> (EO.propertyBox) {
            EO.propertyBox.hasFocus = false;
            <span class="reserved">this</span>.enableKeyboard();
        }
        <span class="reserved">for</span> (var i = 0; i &lt; EO.objectList.length; i++) {
            $(<span class="literal">'#'</span> + EO.getHTMLObject(EO.objectList[i]).id).addClass(<span class="literal">'ui-selected'</span>);
        }
        
        var divEO = document.getElementById(id);
        $(<span class="literal">'#'</span> + divEO.id).addClass(<span class="literal">'edition-area-eo-selected'</span>);
    }
    
	<span class="comment">/**
	 * Simulates a click in an EO.
	 * <span class="attrib">@param</span> {String} id The id of the EO to simulate the click.
	 * <span class="attrib">@param</span> {Object} event The mouse event of the click, if needed.  
	 */</span>
    <span class="reserved">this</span>.clickEO = <span class="reserved">function</span>(id, event){
        <span class="comment">// Defines what happens when someone clicks an EO. Default behaviour.</span>
        var ev = event || window.event;
        var EO = <span class="reserved">this</span>.getEOById(id);

        <span class="reserved">if</span> (ev != null) {
            <span class="reserved">if</span> (ev.ctrlKey) {
                <span class="reserved">if</span> (EO.selected == false) {
                    <span class="reserved">this</span>.selectEO(EO.id);
                }
            }
            <span class="reserved">else</span> {
				
				var countSel = 0;
				<span class="reserved">for</span> (var i = 0; i&lt;objectArray.length; i++){
					<span class="reserved">if</span>(objectArray[i].selected == true){
						countSel += 1;
					}	
					<span class="reserved">if</span> (countSel == 2){
						break;
					}
				}
				
				<span class="comment">//Checks if more than one object is selected</span>
				<span class="reserved">if</span> (countSel&lt;2){
					<span class="reserved">if</span> (EO.propertyBox) {
						EO.propertyBox.removeAllTabs();
					}
	                <span class="reserved">this</span>.unselectAll();
					
	                <span class="reserved">if</span> (EO.selected == false) {
	                    <span class="reserved">this</span>.selectEO(EO.id);
	                }
				}
            }
        }
    }
    
	<span class="comment">/**
	 * Unselects an EO.
	 * <span class="attrib">@param</span> {String} id The id of the EO to be unselected.
	 */</span>
    <span class="reserved">this</span>.unselectEO = <span class="reserved">function</span>(id){
        <span class="comment">// Defines what to do when an object is unselected.	</span>
		myKeyboard.EOM = <span class="reserved">this</span>;	
		
        var EO = <span class="reserved">this</span>.getEOById(id);
		<span class="reserved">if</span> (EO.instructionBox) {
			EO.instructionBox.clearInstruction();
		}
		<span class="reserved">if</span>(EO.propertyBox){
			EO.propertyBox.removeAllTabs();
		}

		<span class="reserved">if</span> (EO.onUnselect) {
			EO.onUnselect(EO);
		}
        EO.selected = false;
        <span class="reserved">for</span> (var i = 0; i &lt; EO.objectList.length; i++) {
            $(<span class="literal">'#'</span> + EO.getHTMLObject(EO.objectList[i]).id).removeClass(<span class="literal">'ui-selected'</span>);
        }
        
        var divEO = document.getElementById(id);
		<span class="reserved">if</span> (divEO) {
			$(<span class="literal">'#'</span> + divEO.id).removeClass(<span class="literal">'edition-area-eo-selected'</span>);
		}
    }
    
	<span class="comment">/**
	 * Sets a property to all selected EOs of a defined type.
	 * <span class="attrib">@param</span> {String} property The property to be changed
	 * <span class="attrib">@param</span> {Any} value The value to be set.
	 * <span class="attrib">@param</span> {String} type The types of objects to be affected.
	 */</span>
    <span class="reserved">this</span>.setPropertyOfSelected = <span class="reserved">function</span>(property, value, type){
        <span class="reserved">for</span> (var i = 0; i &lt; objectArray.length; i++) {
            <span class="reserved">if</span> (objectArray[i].selected == true) {
                <span class="reserved">if</span> (objectArray[i].type == type) {
                    objectArray[i].setProperty(property, value);
                }
            }
        }
    }
    
	<span class="comment">/**
	 * Adds some value to editionArea jQuery selectable cancel property. Look for jQuery UI Selectable if you need help.
	 * <span class="attrib">@param</span> {String} value The value to be added to the cancel property.
	 */</span>
    <span class="reserved">this</span>.addToEditionAreaCancel = <span class="reserved">function</span>(value){
        var cancel = $(<span class="literal">'#editionArea'</span>).selectable(<span class="literal">'option'</span>, <span class="literal">'cancel'</span>);
        <span class="reserved">if</span> (cancel == <span class="literal">''</span>) {
            $(<span class="literal">'#editionArea'</span>).selectable(<span class="literal">'option'</span>, <span class="literal">'cancel'</span>, value);
        }
        <span class="reserved">else</span> {
            $(<span class="literal">'#editionArea'</span>).selectable(<span class="literal">'option'</span>, <span class="literal">'cancel'</span>, cancel + <span class="literal">', '</span> + value);
        }
    };
    
	<span class="comment">/**
	 * Gets a JSON with all EOs, its types and properties.
	 * <span class="attrib">@return</span> A JSON describing all EOs
	 * <span class="attrib">@type</span> {Object}
	 */</span>
    <span class="reserved">this</span>.EO_JSON = <span class="reserved">function</span>(){
        var JSONObject = [];
        <span class="reserved">for</span> (var i = 0; i &lt; objectArray.length; i++) {
            var type = objectArray[i].type;
            var EOJSON = objectArray[i].JSON();
			JSONObject.push({
				type:type,
				properties:EOJSON
			});
        }
        <span class="reserved">return</span> JSONObject;
    }
	
    <span class="comment">/**
     * Gets all the HTML of the EOs managed by this EOM.
     * <span class="attrib">@return</span> An HTML containing all DOM nodes and its properties returned by all EOs managed by this EOM.
     * <span class="attrib">@type</span> {String} 
     */</span>
	<span class="reserved">this</span>.getEOsHTML = <span class="reserved">function</span>(){
		var html = <span class="literal">""</span>;
        <span class="reserved">for</span> (var i = 0; i &lt; objectArray.length; i++) {
            html += objectArray[i].HTML();
        }
		var ind = new indenter();
		var indented_html = ind.indentHTML(html);
        <span class="reserved">return</span> indented_html;
	}
	
	<span class="comment">/**
	 * Creates a set of EOs based on a given JSON object
	 * <span class="attrib">@param</span> {Object} json The JSON used to create the EOs
	 * <span class="attrib">@return</span> The list of EOs created.
	 * <span class="attrib">@type</span> {Array}
	 */</span>
    <span class="reserved">this</span>.createEOsByJSON = <span class="reserved">function</span>(json){
        var EOList = [];
        var EO = null;
		var EOJSON = null;
        <span class="reserved">for</span> (var i=0; i &lt; json[<span class="literal">'eos'</span>].length; i++) {
			EOJSON = json[<span class="literal">'eos'</span>][i];
			<span class="reserved">if</span> (window[EOJSON[<span class="literal">'type-name'</span>]] != null){
	            EO = <span class="reserved">this</span>.createEO(EOJSON[<span class="literal">'type-name'</span>]);
	            editionArea.appendObject(EO);
	            <span class="reserved">for</span> (var property in EOJSON.properties){
	                EO.setProperty(property, unescape(EOJSON.properties[property]));
	            }
	            EOList.push(EO);
			}
        }
        <span class="reserved">return</span> EOList;
    }
	
	<span class="comment">/**
	 * Sets the correct IDs for the DOM nodes in the idsList
	 * <span class="attrib">@param</span> {DOM} DOMNode The DOM node to correct the ids.
	 * <span class="attrib">@param</span> {Array} idsList The list of ids to be changed 
	 */</span>
	<span class="reserved">this</span>.setDOMIds = <span class="reserved">function</span>(DOMNode, idsList){
		var children = DOMNode.childNodes;
		var child = null;
		var oldId = <span class="literal">""</span>;
		var newId = <span class="literal">""</span>;
		
		<span class="reserved">if</span> (idsList == null){
			idsList = [];
		}

		var newIdsList = new Array();
		var list = new Array();
		var getId = false;
		<span class="reserved">for</span> (var i = 0; i &lt; children.length; i++) {
			child = children[i];
			
			<span class="reserved">if</span> (child.id != <span class="literal">""</span>) {
				<span class="reserved">for</span> (var k = 0; k &lt; idsList.length; k++) {
					<span class="reserved">if</span> (child.id == idsList[k]) {
						oldId = idsList[k];
						getId = true;
					}
				}
			}
						 
			
			<span class="reserved">if</span> (child.tagName) {
				child.id = child.parentNode.id + <span class="literal">"_"</span> + i;
				<span class="reserved">if</span> (getId) {
					newId = child.id;
					newIdsList.push([oldId, newId, child]);
				}
				list = <span class="reserved">this</span>.setDOMIds(child, idsList);
				<span class="reserved">for</span> (var k=0; k&lt;list.length; k++){
					newIdsList.push(list[k]);	
				}
			}
		}
		
		<span class="reserved">return</span> newIdsList;
	}
	
	<span class="comment">/**
	 * Attribe correct ids to the DOM nodes of an EO.
	 * <span class="attrib">@param</span> {Object} EO The EO to attrib the ids.
	 */</span>
	<span class="reserved">this</span>.attribIds = <span class="reserved">function</span>(EO){
		var idEO = EO.id;
		var HTMLObject = null;
		var indexEO = parseInt(idEO.substr(idEO.indexOf(<span class="literal">"_"</span>) + 1));
		var idsList = new Array();
		var newIdsList = new Array();
		var ret = new Array();
		
		
		<span class="reserved">for</span> (var i = 0 ;  i&lt; EO.selectorList.length; i++){			
			idsList.push(EO[EO.selectorList[i]].id);
		}
		
		<span class="reserved">for</span> (var i=0; i &lt; EO.objectList.length; i++){
			HTMLObject = EO.getHTMLObject(EO.objectList[i]);
			HTMLObject.id = EO.objectList[i] + <span class="literal">"_"</span> + indexEO;
			
			var list = <span class="reserved">this</span>.setDOMIds(HTMLObject, idsList);
			<span class="reserved">for</span> (var k=0; k&lt; list.length; k++){
				newIdsList.push(list[k]);
			}
		}
		
		<span class="reserved">for</span> (var i=0; i &lt; idsList.length; i++){
			<span class="reserved">for</span> (var k = 0; k &lt; newIdsList.length; k ++){
				<span class="reserved">if</span> (newIdsList[k][0] == EO[EO.selectorList[i]].id){
					ret.push([EO.selectorList[i], newIdsList[k][1], newIdsList[k][2]]);
				}
			}
		}
		
		<span class="reserved">return</span> ret;
	}

	<span class="comment">/**
	 * Sets the events  of onMouseDown to the DOM nodes of an EO, for enabling selection when you click.
	 * <span class="attrib">@param</span> {Object} EO The EO that has the DOM nodes to change the event.
	 * <span class="attrib">@param</span> {Array} idsList Ids of nodes that could be clicked and are not in the selectorList of the EO.
	 */</span>
	<span class="reserved">this</span>.setSelectors = <span class="reserved">function</span>(EO, idsList){
		var len = EO.selectorList.length;
		<span class="reserved">for</span> (var i = 0; i &lt; len; i++) {
			EO[EO.selectorList[i]].onmousedown = <span class="reserved">function</span>(event){
				EO.EOM.clickEO(EO.id, event);
			};
		}
		
		<span class="reserved">if</span> (idsList!= null){
			<span class="reserved">for</span> (var i = 0; i &lt; idsList.length; i++) {
				document.getElementById(idsList[i]).onmousedown = <span class="reserved">function</span>(event){
					EO.EOM.clickEO(EO.id, event);
				};
			}	
		}
	}

	<span class="comment">/**
	 * Changes the snapTo property of all EOs
	 * <span class="attrib">@param</span> {Int} x The x coordinate of the snapTo.
	 * <span class="attrib">@param</span> {Int} y The y coordinate of the snapTo.
	 */</span>
	<span class="reserved">this</span>.setAllEOSnapTo = <span class="reserved">function</span>(x,y){
		<span class="reserved">for</span> (var i = 0 ; i &lt; objectArray.length; i++){
			objectArray[i].setSnapTo(x, y);
		} 
	}
	
	<span class="comment">/**
	 * Moves all selected objects to the left.
	 * <span class="attrib">@param</span> {Int} diff The number of pixels to move it to the left. If negative, moves to the right.
	 */</span>
	<span class="reserved">this</span>.moveSelectedLeft = <span class="reserved">function</span>(diff){
        <span class="reserved">for</span> (var i = 0; i &lt; objectArray.length; i++) {
            <span class="reserved">if</span> (objectArray[i].selected == true) {
                objectArray[i].setLeft(objectArray[i].getLeft() + diff);
            }
        }
	}	

	<span class="comment">/**
	 * Moves all selected objects to the top.
	 * <span class="attrib">@param</span> {Int} diff The number of pixels to move it to the top. If negative, moves to the bottom.
	 */</span>	
	<span class="reserved">this</span>.moveSelectedTop = <span class="reserved">function</span>(diff){
        <span class="reserved">for</span> (var i = 0; i &lt; objectArray.length; i++) {
            <span class="reserved">if</span> (objectArray[i].selected == true) {
                objectArray[i].setTop(objectArray[i].getTop() + diff);
            }
        }		
	}
	
	<span class="comment">/**
	 * Gets a list of all EOs ids
	 * <span class="attrib">@return</span> A list of ids
	 * <span class="attrib">@type</span> {Array}
	 */</span>
	<span class="reserved">this</span>.getEOs = <span class="reserved">function</span>(){
		<span class="comment">// Returns all EOs ids.</span>
		<span class="reserved">return</span> objectIdArray;
	}
	
	<span class="comment">/**
	 * Gets a list of the selected EOs ids
	 * <span class="attrib">@return</span> A list of ids
	 * <span class="attrib">@type</span> {Array}
	 */</span>
	<span class="reserved">this</span>.getSelectedEOs = <span class="reserved">function</span>(){
		var selectedEOsIds = [];
		<span class="reserved">for</span> (var i = 0; i &lt; objectArray.length; i++) {
            <span class="reserved">if</span> (objectArray[i].selected == true) {
                selectedEOsIds.push(objectArray[i].id);
            }
        }
		<span class="reserved">return</span>  selectedEOsIds;
	}
}
</pre>
	<hr>



<!-- ========== START OF NAVBAR ========== -->
<a name="navbar_top"><!-- --></a>
<table border="0" width="100%" cellpadding="1" cellspacing="0">
<tr>
<td colspan=2 bgcolor="#EEEEFF" class="NavBarCell1">
<a name="navbar_top_firstrow"><!-- --></a>
<table border="0" cellpadding="0" cellspacing="3">
  <tr align="center" valign="top">
  
  
  <td bgcolor="#EEEEFF" class="NavBarCell1">    <a href="overview-summary.html"><font class="NavBarFont1"><b>Overview</b></font></a>&nbsp;</td>
  <td bgcolor="#FFFFFF" class="NavBarCell1Rev">	&nbsp;<font class="NavBarFont1Rev"><b>File</b></font>&nbsp;</td>
  

  <td bgcolor="#FFFFFF" class="NavBarCell1"> <font class="NavBarFont1">Class</font>&nbsp;</td>
  <td bgcolor="#EEEEFF" class="NavBarCell1">    <a href="overview-tree.html"><font class="NavBarFont1"><b>Tree</b></font></a>&nbsp;</td>
  <td bgcolor="#EEEEFF" class="NavBarCell1">    <a href="index-all.html"--><font class="NavBarFont1"><b>Index</b></font></a>&nbsp;</td>
  <td bgcolor="#EEEEFF" class="NavBarCell1">    <a href="help-doc.html"><font class="NavBarFont1"><b>Help</b></font></a>&nbsp;</td>
  </tr>
</table>
</td>
<td bgcolor="#EEEEFF" align="right" valign="top"><em>
<b></b></em>
</td>
</tr>

<tr>
<td bgcolor="white" class="NavBarCell2"><font size="-2">
&nbsp;PREV&nbsp;
&nbsp;NEXT</font></td>
<td bgcolor="white" class="NavBarCell2"><font size="-2">
  <a href="index.html" target="_top"><b>FRAMES</b></a>  &nbsp;
&nbsp;<a href="overview-summary.html" target="_top"><b>NO FRAMES</b></a>
&nbsp;&nbsp;
<script>
  <!--
  if(window==top) {
    document.writeln('<A HREF="allclasses-noframe.html" TARGET=""><B>All Classes</B></A>');
  }
  //-->
</script>
<noscript>
<a href="allclasses-noframe.html" target=""><b>All Classes</b></a>
</noscript>
</font></td>
</tr>
</table>
<!-- =========== END OF NAVBAR =========== -->

<hr>
<font size="-1">

</font>
<div class="jsdoc_ctime">Documentation generated by <a href="http://jsdoc.sourceforge.net/" target="_parent">JSDoc</a> on Mon Feb 21 18:12:28 2011</div>
</body>
</html>
